@charset "utf-8";

			body {
				margin: 0;
				padding: 0;
				background-color:#FF3;
				overflow: hidden;
				-moz-user-select: none;
				-ms-user-select: none;
				-webkit-user-select: none;
				-webkit-transform: translate3d(0, 0, 0);
				-moz-transform: translate3d(0, 0, 0);
				-ms-transform: translate3d(0, 0, 0);
				-o-transform: translate3d(0, 0, 0);
				transform: translate3d(0, 0, 0);
				-webkit-backface-visibility: hidden;
				-moz-backface-visibility: hidden;
				-ms-backface-visibility: hidden;
				backface-visibility: hidden;
			}
			
			#box {				
				display: flex;
    			justify-content: center; /* 水平居中 */
				font-family: 'xingkai';
				width: 100vw;
				height: 100vh;
				margin: 0;
				padding: 0;
				position: relative;
				top: 0;
				left: 0%;
				text-align: center;
				font-size: 2.5vmin;
				z-index:1;
				align-items:center;/*垂直居中*/
			}
			
			#map {
				position: relative;
				padding: 0px;
				border: 0.06rem solid darkgoldenrod;
				background: rgba(249, 216, 162, 1);
			}
			

        .button-container {
            display: flex;
            gap: 10px; /* 按钮之间的间距 */
		}
.game-button {
    padding: 10px 20px;
    font-size: 1vh;
    cursor: pointer;
    border: none;
    border-radius: 5px;
    background-color: #007BFF;
    color: white;
    transition: background-color 0.3s ease;
	max-height:5vh;
}
 
 
.game-button:hover {
    background-color: #0056b3;
}
.map-container {
    display: flex;
    flex-direction: column; /* 垂直布局 */
    align-items: center; /* 水平居中子元素 */
    /* 如果需要，可以添加一些额外的样式来控制布局和间距 */
}

 
/* 模态窗口样式 */
.modal {
  display: none; /* 默认隐藏 */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* 半透明背景 */
  justify-content: center;
  align-items: center;
  z-index:1000;
}

.modal-content {
  background-color: white;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
}

.modal-content button {
  margin: 10px;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

#agreeDraw {
  background-color: green;
  color: white;
}

#rejectDraw {
  background-color: red;
  color: white;
}

.rotate-180 {
    transform: rotate(180deg);
}
/*-------------倒计时模块-------------------*/
		.timer_container {
            display: flex;
            justify-content: space-between; /* 可选，用于在子元素之间添加间距 */
            align-items: center; /* 垂直居中 */
			background-color:#FFF;

        }
        .timer-wrapper {
            display: flex;
            align-items: center;
        }
        .label {
            margin-right: 2px; /* 可选，用于在标签和倒计时数字之间添加间距 */
        }
        .countdown {
            font-size: 3vh; /* 可选，用于设置倒计时数字的字体大小 */
            font-weight:bold; /* 可选，用于设置倒计时数字的字体粗细 */
			color:#000;
        }
		/*以下代码来自lfn，主要是额外按钮的逻辑和样式*/		
        .horizontal-container {
            display: flex;
            align-items: center; /* 垂直居中 */
            gap: 10px; /* 元素之间的间距 */
			max-height:5vh;
        }
		#uplist{
			max-height:10vh;
			overflow:hidden;/*可以让溢出的子元素被屏蔽*/	
			}
		#downlist{
			max-height:5vh;
			}


#video{
	background-color:#0F0;
	margin-right:5vw;
	}


/*宽度大于800就应用这个*/
@media (min-width: 800px) {
	#box {
		width: 100vw;
		height: 100vh;
		position: relative;
		left: 0;
		top: 0;
		z-index:1;
		background-color:#FF3
	}
	